<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit"/>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="keywords" content="微信墙,活动现场">
    <meta name="description" content="微信墙,活动现场">

    <title>抢红包 - {$reply['title']}</title>

    <link href="../addons/haoman_dpm/newhb_img/swallv5/dist/css/style.min.css" type="text/css" rel="stylesheet">
    <script type="text/javascript" src="../addons/haoman_dpm/newhb_img/local_config_aspx.js"></script>

    <style type="text/css" id="tStyleNode">
        .cutdown-start{
            display: none;
            width: 500px;
            font-size: 334.6px;
            line-height: 478px;
            height: 480px;
            text-align: center;
            position: absolute;
            left: 50%;
            top: 50%;
            margin-left: -250px;
            margin-top: -120px;
            z-index: 99999999;
            color: #fff;
        }
        .cutdownan-imation {
            -webkit-animation: cutdownan-keyframes 1000ms infinite ease both;
            -moz-animation: cutdownan-keyframes 1000ms infinite ease both;
        }

        @-webkit-keyframes cutdownan-keyframes {
            0% {
                opacity: 0;
                -webkit-transform: scale(.3)
            }
            50% {
                opacity: 1;
                -webkit-transform: scale(1.05)
            }
            70% {
                -webkit-transform: scale(.9)
            }
            100% {
                -webkit-transform: scale(6);
                opacity: 0
            }
        }

        @-moz-keyframes cutdownan-keyframes {
            0% {
                opacity: 0;
                -moz-transform: scale(.3)
            }
            50% {
                opacity: 1;
                -moz-transform: scale(1.05)
            }
            70% {
                -moz-transform: scale(.9)
            }
            100% {
                -moz-transform: scale(6);
                opacity: 0
            }
        }
        /* 婚庆主题为例 */
        .body-skin {
            background-image: none;
        }

        /* 区域背景色 */
        .container .content {
            background: rgba(255, 255, 255, 0.2) !important;
        }

        /* 婚庆模板为例 */
        .content-topic {
            padding: 1vw 2vw;
        }

        .content-topic .item + .item {
            margin-top: 4.2vh;
        }

        .content-topic .item .txt span {
            font-size: 2vw;
        }

        div.content-topic div.item .txt span {
            color: white
        }

        .frame-blocks {
            display: none;
        }
    </style>

    <script type="text/javascript">
        var Get_RedPackLuckies = "{php echo $this->createMobileUrl("GetRedPackLuckies", array('rid' => $rid))}";
        var Get_RedPackLucky = "{php echo $this->createMobileUrl("GetRedPackLucky", array('rid' => $rid))}";
        var Set_RedPackstart = "{php echo $this->createMobileUrl("SetRedPackstart", array('rid' => $rid))}";
        var Get_RedPackLuckyWinners = "{php echo $this->createMobileUrl("GetRedPackLuckyWinners", array('rid' => $rid,'hbpici'=>$reply['hbpici']))}";
        var Get_RedPackLuckyTopWinners = "{php echo $this->createMobileUrl("GetRedPackLuckyTopWinners", array('rid' => $rid,'hbpici'=>$reply['hbpici']))}";
        var Set_RedPackend = "{php echo $this->createMobileUrl("SetRedPackend", array('rid' => $rid))}";
        var Get_RoomUserCount = "{php echo $this->createMobileUrl("GetRoomUserCount", array('rid' => $rid))}";
        var hb_chongzhi = "{php echo $this->createMobileUrl("hbchongzhi", array('id' => $rid))}";

        var W_Data = {
            "RoomName": "{$reply['title']}",
            "SubTitle": "扫描右侧二维码参与互动",
        };
        var W_SKIN = {
            "Banner": null,
            "Logo": "{php echo tomedia($reply['up_qrcode'])}",
            "BackgroundImage": "{$bg}",
            "BackgroundVodie": "{$video['vodio_bg6']}",
            "ContentBgColorRGB": "rgba(255,255,255,0.2)",
            "TemplateName": "white",

        };</script>


    <script type="text/javascript">
        var W_SKIN = typeof W_SKIN !== 'undefined' ? W_SKIN : {};

        var maybyUrl = W_LocalBaseUrl;

        var LCOAL_INNER_URL = maybyUrl;

        var $CONFIG = {
//            wallid: W_WallId,
            AppURL: LCOAL_INNER_URL,
            StaticURL: LCOAL_INNER_URL + 'swallv5/',
            WallURL: LCOAL_INNER_URL
        };

    </script>
    <script src="../addons/haoman_base/base/jquery-1.9.1.min.js"></script>
    <!--<script src="../addons/haoman_base/base/jquery.vedio.js"></script>-->
</head>

<body style="display: block" class="body-skin" {if !empty($video['vodio_bg6'])}data-vide-bg="{php echo tomedia($video['vodio_bg6'])}"{/if}>
<div class="">
        <div class="dpm_hb" data-hash="bonus"></div>
</div>
{template 'dpm_Keyborad'}
<audio src="{$music2}" preload="auto" id="media2"></audio>

<audio src="{$music}" preload="auto" id="media" autoplay="autoplay" loop="loop"></audio>
<!-- <audio loop="loop" src="{$music}" id="media" preload="preload"></audio> -->
<div class="cutdown-start cutdownan-imation">GO!</div>
<script type="text/javascript" src="../addons/haoman_dpm/newhb_img/swallv5/js/lib/require-min.js"></script>

<script src="../addons/haoman_dpm/newhb_img/swallv5/js/plugin/echarts-2.2.7/echarts.js"></script>
<script>
    var _m = document.getElementById('media2');
    function test() {
        $(".cutdown-start").hide();
        $(".cutdown-start").removeClass("cutdownan-imation");
        _m.pause();
    }
</script>
<script type="text/javascript">
    require(['big_screen_frame'], function (bsf) {
        bsf.init();
    });
</script>
</body>

</html>
